#{extends 'mainFMPA.html' /}
#{set title:'Ajouter une fiche'/}

<script type="text/javascript" src="../../../public/javascripts/jquery-ui-1.8.13.custom/js/jquery-ui-1.8.13.custom.min.js"></script>
<script type="text/javascript" src="../../../public/javascripts/jquery-ui-1.8.13.custom/development-bundle/ui/i18n/jquery.ui.datepicker-fr.js"></script>

<SCRIPT>
	$(function() {
		$( "#date" ).datepicker();
	});
</SCRIPT>

<h3>Ajouter une Fiche</h3>
     
#{form @newFicheSave()}
	<p>
 	    <label for="CIS"><b>CIS* :</b></label> 
		#{select 'cis', items:centres, id:'cis', valueProperty:'id', value:idCis}
		#{/select}
    </p>
    <p>
 	    <label for="CIS"><b>Origine de l'agent :</b></label> 
		#{select 'cis', items:centresbis, id:'centre', valueProperty:'id', value:idCis, onChange:'change()'}
		#{/select}
    </p>
	<p id="aModifier">
		<label for="agent"><b>Agent* :</b></label>
		#{select 'agent', items:agents, id:'agent', value:fiche?.agent?.id}
		#{/select}
	</p>
    <p>
        <label for="date"><b>Date* :</b></label>
        <input type="text" name="date" id="date" value="${fiche?.date?.format('dd/MM/yyyy', 'fr')}" />
    <p>
    <p>
 	    <label for="moyen"><b>Moyen &eacute;chelle :</b></label>
        #{select 'moyen', items:moyens, id:'moyen', value:fiche?.moyen?.id}
        #{/select}
    </p>
    <p>
 	    <label for="duree"><b>Dur&eacute;e* :</b></label>
        #{select 'duree', items:durees, id:'duree', value:fiche?.duree?.id}
        #{/select}
    </p>
    <p>
 	    <label for="cadre"><b>Cadre d'utilisation :</b></label>
        #{select 'cadre', items:cadres, id:'cadre', value:fiche?.cadre?.id}
        #{/select}
    </p>
    <p>
 	    <label for="role"><b>Fonction :</b></label>
        #{select 'role', items:roles, id:'role', value:fiche?.role?.id}
        #{/select}
    </p>
    <p>
    <br />
    <p style="margin-top:30px; margin-left:150px;">    
        <input type="submit" value="Enregistrer la fiche" />
        <input type="button" onClick="self.location.href='@{FicheEchelles.listEchelle()}'" value="retour" />
    </p>
    <p style="font-size:16px;"><i>* Champs obligatoires<i></p>
#{/form}

<SCRIPT type="text/javascript">
	function change(){
	    var monCis=document.getElementById("centre").options[document.getElementById("centre").selectedIndex].value
	    $('#aModifier').load("/attraper/"+monCis)
	}
</SCRIPT>